import React from 'react'
import context from './context'

class TodoItem extends React.Component {
    // constructor(props,context){
    //     super();
    //     console.log('contructor',context)
    // }
    // getData = ()=>{
    //     this.context.removeItem()
    // }
    render() {
        const { data, index } = this.props
        const {removeItem,completeItem} = this.context;
        console.log('context',this.context);
        return (
            <tr className={data.done ? 'table-success' : ''}>
                <th scope="row">{index + 1}</th>
                <td>{data.todo}</td>
                <td>{data.date}</td>
                <td>{data.done ? '是' : '否'}</td>
                <td>
                    <i className="bi bi-check-square me-3" onClick={completeItem.bind(null, data.id)}></i>
                    <i className="bi bi-x-square" onClick={removeItem.bind(null, data.id)}></i>
                </td>
            </tr>
        )
    }
}
TodoItem.contextType = context

export default TodoItem;